<template>
  <CommonTable v-bind="options" v-model:columns="columns" style="height: calc(100vh - 155px)"/>
</template>

<script setup>
import CommonTable from "@/components/common/CommonTable.vue"
import {ref} from "vue";
defineOptions({ name: 'student' })

const columns = ref([
  { type: 'selection', width: 55 },
  { type: 'index', label: '序号', width: 55 },
  { label: '姓名', prop: 'name'},
  { label: '年龄', prop: 'age'},
  { label: '邮箱', prop: 'email'},
  { label: '创建时间', prop: 'createdAt'},
])

const formOption = {
  options: [
    { label: '姓名', prop: 'name' },
    { label: '年龄', prop: 'age' },
    { label: '邮箱', prop: 'email' },
  ]
}

const excelColumns = []
for (const column of columns.value) {
  excelColumns.push(JSON.parse(JSON.stringify(column)))
}

const options = {
  baseUrl: '/student',
  simpleTitle: '学生',
  columns,
  actions: [
    { action: 'add', location: 'top', formOption },
    { action: 'detail', location: 'row', formOption },
    { action: 'edit', location: 'row', formOption },
    { action: 'delete', location: 'row' },
    { action: 'importTemplate', location: 'top', excelOption: { columns: excelColumns }},
    { action: 'importData', location: 'top', excelOption: { columns: excelColumns }},
  ],
  querySearch: {
    options: [
      { label: '姓名', prop: 'name@@LIKE' },
      { label: '年龄', prop: 'age@@LIKE' },
      { label: '邮箱', prop: 'email@@LIKE' },
    ]
  }
}
</script>

<style scoped lang="scss">

</style>
